<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        #box{
            height:100px;
            width:100px;
            background-color: aquamarine;
        }
    </style>
</head>
<body>
    <div id="box"></div>
    <a href="http://www.baidu.com" id="abox">baidu</a>
    <input type="text" id="inp">
    <script>
        //a 默认行为 跳转页面
        abox.onclick=function(e){
            if(e&&e.preventDefault){
                e.preventDefault();//取消事件的默认行为--FF
            }else{
                e.returnValue=false;//取消事件的默认行为--TE
            }
        }

        //  box.oncontextmenu=function(e){
        //     if(e&&e.preventDefault){
        //         e.preventDefault();//取消事件的默认行为--FF
        //     }else{
        //         e.returnValue=false;//取消事件的默认行为--TE
        //     }
        //     console.log("右键单击");
        // }


        //事件句柄
        //1.鼠标事件  键盘事件 表单事件 系统事件 移动端事件
        //鼠标事件
        //click 点击
        //dblclick 双击
        //mousemove 移动
        //mouseenter 移入   mouseleave 移出  没有冒泡
        //mouseover 移入   mouseout 移出     有冒泡
        //mousedown 按下  mouseup 抬起
        //contextmenu 右键单击(默认行为：会出现菜单栏)

        //键盘事件
        //keydown键盘按下
        //keyup键盘抬起
        //keypress 键盘 按下+抬起
        //在所有浏览器中 onkeypress 事件不是适用于所有按键(如： ALT, CTRL, SHIFT, ESC)。监听一个用户是否按下按键请使用 onkeydown 事件,所有浏览器都支持 onkeydown 事件
        //input、textarea、window、document.documentElement、document.body

        // inp.onkeypress=function(){
        //     console.log("键盘按下1111");
        // }

        // inp.onkeydown=function(){
        //     console.log("键盘按下");
        // }
        // inp.onkeyup=function(){
        //     console.log("键盘抬起");
        // }


        // box.onmousedown=function(){
        //     console.log("按下");
        // }
        // box.onmouseup=function(){
        //     console.log("抬起");
        // }

        // box.onmouseover=function(){
        //     console.log("移入");
        // }
        // box.onmouseout=function(){
        //     console.log("移出");
        // }

        // box.onmouseenter=function(){
        //     console.log("移入");
        // }
        // box.onmouseleave=function(){
        //     console.log("移出");
        // }

        // box.onmousemove=function(){
        //     console.log("移动");
        // }

        // box.ondblclick=function(){
        //     console.log("双击");
        // }
    </script>
</body>
</html>